<template>

    <a-tabs>
        <a-tab-pane key="flowTrunRecord" tab="流转记录">
            <timelineForm :commentList="commentList" />
        </a-tab-pane>
        <a-tab-pane key="flowChart" tab="流程图">
            <flowChart v-model="modelDesignData" />
        </a-tab-pane>
    </a-tabs>
    <div v-show="false">
        <slot>
        </slot>
    </div>
</template>
<script setup>
import processApi from '@/api/flw/processApi'
import flowChart from '@/components/XnWorkflow/chart/index.vue'
import timelineForm from '@/views/flw//process/timelineForm.vue'
const props = defineProps({
    id: {
        type: String,
    }
})
const modelDesignData = ref({})
const commentList = ref([])
const loadData = () => {
    processApi.processDetail({ id: props.id }).then((data) => {
        modelDesignData.value = JSON.parse(data.initiatorModelJson)
        commentList.value = data.commentList
        return commentList;
    })
}
nextTick(() => {
    loadData()
})
watch(
    () => props.id,
    (newVal, oldVal) => {
        if (newVal) {
            nextTick(() => {
                loadData()
            })
        }
    },
    { deep: true, immediate: true }
)
</script>